<template>
  <el-card class="box-card">
    <div slot="header" class="clearfix">
      <span style="float: left; padding: 3px 0">待审批改单</span>
      <span style="margin-right: 30px">{{waybillNo}}</span>
      <span style="margin-right: 600px">{{inStockChannel}}</span>
    </div>
    <el-row>
      <div class="text item">
        <span style="float: left; padding: 3px 0">改单编号:</span>
        <span style="margin-right: 600px">{{changeOrderNo}}</span>
      </div>
    </el-row>
    <br/>
    <el-row>
      <div class="text item">
        <span style="float: left; padding: 3px 0">运单号:</span>
        <span style="margin-right: 600px">{{waybillNo}}</span>
      </div>
    </el-row>
    <br/>
    <el-row>
      <div class="text item">
        <span style="float: left; padding: 3px 0">改单内容:</span>
        <span style="margin-right: 600px">{{changeOrderContent}}</span>
      </div>
    </el-row>
    <br/>
    <el-row>
      <div class="text item">
        <span style="float: left; padding: 3px 0">改单申请人:</span>
        <span style="margin-right: 600px">{{changeOrderUser}}</span>
      </div>
    </el-row>
    <br/>
    <el-row>
      <div class="text item">
        <span style="float: left; padding: 10px 0">改单时间:</span>
        <span style="margin-right: 600px">{{changeOrderDate}}</span>
      </div>
    </el-row>
    <el-form-item>
      <el-button type="primary" style="font-size: 15px; margin-left: 50px" @click="dialogVisible = true">驳回</el-button>
      <el-dialog :visible.sync="dialogVisible" width="50%" :append-to-body="true"  :before-close="handleClose">
        <template >
          <span >驳回原因:</span>
          <el-input type="textarea"  :rows="10" v-model="rejectReason"></el-input>
        </template>
        <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="saveRejectReason">确定</el-button>
      </span>
      </el-dialog>
      <el-button type="primary" style="font-size: 15px; float: right; padding: 3px 0; margin-right: 600px" @click="passApproval">审批通过</el-button>
    </el-form-item>
  </el-card>
</template>

<script>
  import {m, notify} from "@/store/yg/common/local";
  import {ajax} from "@/store/yg/common/utils";
  import axios from "axios";
  import * as constant from "@/store/yg/common/constant";
  import ShowPayments from "../../../main/finance/payapply/showPayments";

  export default {
    data() {
      return {
        dialogVisible: false,
        changeOrderNo:"",
        changeOrderContent:"",
        rejectReason:"",
        changeOrderDate:"",
        changeOrderUser:"",
        waybillNo:"",
        inStockChannel:"",
        userOption:[],
        id:"",
        ids:[],
      };
    },

    mounted() {
      this.initData();
    },
    methods: {
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});

      },
   initData(){
     console.log(this.$store.state)
     this.changeOrderNo=this.$store.state.edit.row["changeOrderNo"];
     this.changeOrderContent=this.$store.state.edit.row["changeOrderContent"];
     this.changeOrderDate=this.$store.state.edit.row["changeOrderDate"];
     this.changeOrderUser=this.$store.state.edit.row["changeOrderUser"];
     this.id=this.$store.state.edit.row["id"];
     this.rejectReason=this.$store.state.edit.row["rejectReason"];
     this.waybillNo=this.$store.state.edit.row["waybillNo"];
     this.userOption=this.$store.state.edit.entry.sources["userSource"];
     this.changeOrderUser=this.userOption[this.changeOrderUser];
     //根据运单号去拿渠道
     if (this.waybillNo!=null&&this.waybillNo!=""){
       ajax("queryChannelIds", {
         waybillNo: this.waybillNo
       })
         .then(res => {
           this.inStockChannel = res.data;
         })
         .catch(error => {
           console.log(error);
         });
     }
   },
      async  saveRejectReason(){
        this.ids.push(this.id);
        let req = {};
        req.rejectReason=this.rejectReason;
        req.ids =   this.ids;
        const { code, data, message } = await ajax(
          "saveRejectReason",
          req
        );
          this.$message({
            type: "success",
            message: "成功驳回"
          });
      },
      //审批通过
      async passApproval(){
        this.ids.push(this.id);
        let params = {};
        params["userId"]=this.$store.state.auth.user["id"];
        console.log("userID",params.userId)
        const { code, data, message } = await ajax(
          "remarkStatusApprovalAll",
          this.ids,
          params
        );
        if (code==200){
          this.$message({
            type: "success",
            message: "审批通过"
          });
        }else {
          if (message) {
            this.$message.error(message);
          } else {
            this.$message.error("服务器异常");
          }
        }

      }
    }
  };
</script>

<style scoped>
  .text {
    font-size: 15px;
  }

  .item {
    margin-bottom: 30px;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both
  }

  .box-card {
    width: 1135px;
  }
</style>
